// JavaScript Document
$(function(){
	var popup_function = function(){
		$('.delete').off('click').on('click',function(e){
			e.preventDefault();
			var background =$(document.createElement('div')).appendTo( "body" ).addClass('popup_background').click(function(){
					$(this).fadeOut('slow',function(){	$(this).remove();	});

			});
	
			$(document.createElement('div')).fadeIn('slow','linear').appendTo(background).attr('id','delete_popup').click(function(e){
				e.stopPropagation();
			});
		
			var delete_popup_text = $(document.createElement('div')).appendTo('#delete_popup').css('text-align','center');
			$(delete_popup_text).append('<h2>Er du sikker på at du vil slette?</h2>');
			
			var outer_materials =$(document.createElement('div')).appendTo('#delete_popup').attr('id','delete_popup_outer_materials');
			
			// Material 
			if($(this).closest('table').attr('id') == "material"){			
				var delete_table = $(document.createElement('table')).appendTo(outer_materials);
				var delete_table_row = $(document.createElement('tr')).appendTo(delete_table);
				var delete_td_img = $(document.createElement('td')).appendTo(delete_table_row);
				var delete_td_text = $(document.createElement('td')).appendTo(delete_table_row);
				
				var material_id = $(this).closest('tr').attr('id');
			
				var picture_src = $(this).closest('tr').find('img').attr('src');
				var material_name = $('#' + material_id + '_name').html();
				var material_media = $('#' + material_id + '_media').html();
				var material_genre = $('#' + material_id + '_genre').html();
				var material_releasedate = $('#' + material_id + '_releasedate').html();
				
				$(document.createElement('img')).attr('src',picture_src).appendTo(delete_td_img).attr('id','delete_popup_img');
				$(document.createElement('ul')).appendTo(delete_td_text)
					.append('<li><b>Navn: </b>'+material_name+'</li>')
					.append('<li><b>Medie: </b>'+material_media+'</li>')
					.append('<li><b>Genre: </b>'+material_genre+'</li>')
					.append('<li><b>Release dag: </b>'+material_releasedate+'</li>');
			}
			
			// load_material function
			var page_max = 5;
			var page_min = 2;
			var limit = page_min;
			var offset = 0;
			
			$.fn.load_material =function(element){
				$(element).load(url,(table+'&'+column+'&limit='+limit+'&offset='+offset+'&id='+id),function(){
					
					var rows =$('#num_rows').val();
					
					if(limit != page_min){		
						// Næste/forige knap
						var page_change = function(){
							$(prev).remove();
							$(next).remove();
							$(element).load_material(element);
							
						};
						if(offset-page_max >= 0 ){
							var prev =
							$(document.createElement('a')).appendTo('#delete_popup_outer_materials').attr('href','#')
							.text('Forige').attr('id','prev').click(function(){
								offset -= page_max;
								page_change();
							});
						}
						if(offset+page_max < rows){
							var next =
							$(document.createElement('a')).appendTo('#delete_popup_outer_materials').attr('href','#')
							.text('Næste').attr('id','next').click(function(){
								offset += page_max;
								page_change();
							});
						}
					}else if(limit == page_min && rows > limit){
						$(document.createElement('a')).appendTo('#delete_popup_outer_materials').attr('href','#').text('Flere materialer').click(function(){
							limit = page_max;
							$(element).load_material(element);
							$(element).animate({
								height: $(element).find('img').closest('td').outerHeight() * limit + 90 + 'px'
								
							},500);
							$(this).remove();
						});
					}
					
					popup_function();
				});
			};
			
			// Genre
			if($(this).closest('table').attr('id') == "genre"){
				var genre_id =$(this).closest('tr').attr('id');
				var genre_name = $('#' + genre_id + '_name').val();
				
				//(INCOMPLETE) Bruger value i input feltet som kan ændres og derfor ikke længere er navnet på det medie man sletter
				$(delete_popup_text).append('<b>Genren: </b>'+genre_name);	
				
				var url = 'load_material.php';
				var table = 'table=itemgenre';
				var column = 'column=GenreId';
				var id = $('#' + genre_id + '_id').attr('value');
	
				var inner_materials = $(document.createElement('div')).attr('id','delete_popup_inner_materials')
				.appendTo(outer_materials).load_material('#delete_popup_inner_materials');
		
			}
			
			// Media
			if($(this).closest('table').attr('id') == "media"){
						
				var media_id =$(this).closest('tr').attr('id');
				var media_name = $('#' + media_id + '_name').val();
				
				//(INCOMPLETE) Bruger value i input feltet som kan ændres og derfor ikke længere er navnet på det medie man sletter
				$(delete_popup_text).append('<b>Mediet: </b>'+media_name);
				
				var url = 'load_material.php';
				var table = 'table=item';
				var column = 'column=MediaId';
				var id = $('#' + media_id + '_id').attr('value');
	
				var inner_materials =$(document.createElement('div')).attr('id','delete_popup_inner_materials')
				.appendTo(outer_materials).load_material('#delete_popup_inner_materials');
									
			}
			
			$(document.createElement('a')).appendTo('#delete_popup').attr('href',this.getAttribute("cfm_href")).attr('id','cfm_delete').text('Slet');
			$(document.createElement('a')).appendTo('#delete_popup').attr('href','#').addClass('cancel').text('Fortryd');
			$('.cancel').off('click').on('click',function(){
				$(this).closest('div.popup_background').fadeOut('slow',function(){	$(this).remove();	});
			});
					
			$('#cfm_delete').focus();
			$('#delete_popup').css('marginLeft', function() { 
		 			return (($('#delete_popup').outerWidth()/2)*-1);
			});
			popup_function();
		});
		
		$('a[pageload="true"]').off('click').on('click',function(e){
			e.preventDefault();
			var background = $(document.createElement('div')).appendTo( "body" ).addClass('popup_background').click(function(){
				$(this).fadeOut('slow',function(){$(this).remove();});

			});

			var popup =$(document.createElement('div')).fadeIn('slow','linear').appendTo(background).attr('id','page_popup').click(function(e){
				e.stopPropagation();
			});
			var url = $(this).attr('href');
			$(popup).load(url + ' #page_content',function(){
				
				$(popup).css('marginLeft', function() { 
		 			return (($(popup).outerWidth()/2)*-1);
				});
				$('.cancel').off('click').on('click',function(){
					$(this).closest('div.popup_background').fadeOut('slow',function(){	$(this).remove();	});
				});
								
				popup_function();
			});
			
					
		});
		
		$(document.createElement('button')).appendTo('.popup_background').append('Close').addClass('close_background').on('click',function(){
			$('.popup_background').fadeOut('slow',function(){	$(this).remove();	});
		});	
		
	};

	popup_function();
});